
\section{流程图绘制}
\subsection{使用Tikz绘制流程图}
图~\ref{flowchart-tikz}是使用Tikz绘制的流程图。
\usetikzlibrary{shapes.geometric,arrows}
\usetikzlibrary{fit}
\usetikzlibrary{backgrounds}
\tikzstyle{startstop} = [rectangle, rounded corners, minimum width=3cm, minimum height=1cm, text centered, draw=black, fill=red!30]
\tikzstyle{io}        = [trapezium, trapezium left angle=70, trapezium right angle=110, minimum width=3cm, inner xsep = -15pt, minimum height=1cm, text centered, draw=black, fill=blue!30]
\tikzstyle{process}   = [rectangle, minimum width=3cm, minimum height=1cm, inner ysep=0, text centered, draw=black, fill=orange!30]
\tikzstyle{decision}  = [diamond,shape aspect=2.5, minimum width=3cm, minimum height=1cm, inner xsep=0,text centered, draw=black, fill=green!30]
\tikzstyle{arrow}     = [thick,->,>=stealth]

\begin{figure}[H]
	\centering
	\begin{tikzpicture}[node distance=2cm]
		% adding nodes
		\node (start) [startstop] {Start};
		\node (io1)   [io, below of=start] {Lamp doesn't work};
		\node (dec1)  [decision, below of=io1] {Lamp plugged in?};
		\node (dec2)  [decision, below of=dec1, yshift=-0.3cm] {Bulb burned out?};
		
		\node (pro2) [process, below of=dec2] {Repair lamp};
		\node (stop) [startstop, below of=pro2] {Stop};
		
		\node (pro3) [process, left of=dec1, xshift=-2.5cm] {Plug in lamp};
		\node (pro4) [process, right of=dec2, xshift=2.5cm] {Replace bulb};
		
		% adding frame
		\begin{scope}[on background layer,label distance=1cm] % if you prefer pin, pin distance=1cm, and change label below to pin
			\node [draw=black!50,dashed,thick,fill=black!10,fit=(dec1) (dec2),label={[draw=red,fill=black!20,inner sep=0,anchor=south west]north east:{I am a node, too!}}] {};
		\end{scope}
		
		% adding arrows
		\draw [arrow] (start) -- (io1);
		\draw [arrow] (io1) -- (dec1);
		\draw [arrow] (dec1) -- node[anchor=east] {yes} (dec2);
		\draw [arrow] (dec2) -- node[anchor=east] {no } (pro2);
		
		\draw [arrow] (dec1) -- node[anchor=south] {no }(pro3);
		\draw [arrow] (dec2) -- node[anchor=south] {yes}(pro4);
		
		\draw [arrow] (pro4) |- (stop);
		\draw [arrow] (pro3) |- (stop);
		
		\draw [arrow] (pro2) -- (stop);
	\end{tikzpicture}
	\caption{使用Tikz绘制流程图}\label{flowchart-tikz}
\end{figure}

\subsection{插入其他软件绘制的流程图}
图~\ref{flowchart}~是使用Visio绘制后保存为jpg格式的流程图，使用正常插入图片的方法即可。
\begin{figure}[h]			%需要图片在固定位置出现时，将h改为H
	\centering
	\includegraphics[width=6cm]{flowchart}
	\caption{使用Visio绘制的流程图} \label{flowchart}
\end{figure}

\subsection{Tikz绘制思维导图}
图~\ref{mindmap}~是Tikz绘制的思维导图，关于Tikz更多信息可以查看\url{https://www.cnblogs.com/tsingke/p/6649800.html}
\begin{figure}[H]
	\centering
	\begin{tikzpicture}[root concept/.append style = {concept color=blue,font = \color{white}\Large\bfseries },mindmap,scale=0.9]
		\tikzstyle{every node}=[font=\small,scale=0.9]
		\node[concept]{WebGIS}[clockwise from=0]
		child[grow=60,concept color = orange,font = \color{white}\bfseries \large ]{
			node[concept]{前端}		%这里是第二级节点
			[clockwise from  = 135]
			child[font = \color{white}\bfseries]{node[concept]{HTML}}
			child[font = \color{white}\bfseries]{node[concept]{CSS}}
			child[font = \color{white}\bfseries]{node[concept]{Vue}}
			child[font = \color{white}\bfseries]{node[concept]{Mapbox、Openlayers}}
		}
		child[grow=-60,concept color =   green!50!black,font=\color{white}\bfseries\kaishu\large]{
			node[concept]{后端} 
			[clockwise from = 45] 
			child[font = \color{white}\bfseries]{node[concept]{ArcGIS  API for Java}}
			child[font = \color{white}\bfseries]{node[concept]{ 高德 API }}
			child[font = \color{white}\bfseries]{node[concept]{Java Script}}
			child[font = \color{white}\bfseries]{node[concept]{源数据的获取-如Python爬虫}}
		};
	\end{tikzpicture}
	\caption{WebGIS 技术思维导图}\label{mindmap}
\end{figure}
